<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>单个视频</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
	<link href="../../../css/mui.css" rel="stylesheet"/>
	<link href="../../../css/mui.min.css" rel="stylesheet"/>
	<link href="../../../css/mui-icons-extra.css" rel="stylesheet"/>
	<link href="../../../css/app.css" rel="stylesheet"/>
	<style type="text/css">
	</style>
</head>
<body>
	<!-- 头部HEADER -->
	<header class="mui-bar mui-bar-nav">
		<span class="mui-icon mui-icon-back" 
			onclick="jumpToMyZanList()"></span>
		<h1 class="mui-title" id="vTitle">单个视频</h1>
	</header>
	<br>
	<!-- 头部HEADER -->
	
	<!-- 首页视频布局 -->
	<div class="app-video-bg" id="refresh">
	</div>
	<!-- 首页视频布局 -->
	
	<!-- 底部菜单 -->
	<nav class="mui-bar mui-bar-tab">
		<a class="mui-tab-item" onclick="jumpToIndex()">
			<span class="mui-icon mui-icon-home"></span>
			<span class="mui-tab-label">首页</span>
		</a>
		<a class="mui-tab-item" onclick="jumpToMarket()">
			<span class="mui-icon mui-icon-download"></span>
			<span class="mui-tab-label">库</span>
		</a>
<!-- 		<a class="mui-tab-item" onclick="jumpToChat()">
			<span class="mui-icon mui-icon-chatbubble"></span>
			<span class="mui-tab-label">消息</span>
		</a> -->
		<a class="mui-tab-item mui-active" onclick="jumpToMy()">
			<span class="mui-icon mui-icon-contact"></span>
			<span class="mui-tab-label">我的</span>
		</a>
	</nav>
	<!-- 底部菜单 -->
</body>
</html>


<script src="../../../js/mui.js"></script>
<script src="../../../js/app.js"></script>
<script type="text/javascript">
	var vid = getUrlParam('vid');
	//自动加载
	(function($, owner) {
		getMarket(); 
	}(mui, window.app = {}));
	//获取列表
	function getMarket(){
		//屏幕宽度
		var cw = document.documentElement.clientWidth; 
		// //屏幕高度
		// var ch = document.documentElement.clientHeight; 
		var resList = getMarketCache(); //首页缓存
		var list = resList.list;
		if (list.length==0) {
			mui.toast('没有数据',{ 
				duration:'long', type:'div',
			});
			setTimeout(function(){
				mui.back();
			}, 2000);
			return
		}
		var h = '';
		var vs = list;
		var videoId = 0; //去重用
		for (var i=0;i<vs.length;i++) {
			if (vs[i].videoId==vid && videoId!=vid) {
				var vHeight = Math.round(cw * vs[i].videoRatio);
				//显示有限字数
				var vTitle = getStrLimitNum(vs[i].videoTitle, 15); 
				h += '<div class="app-video" style="height:'+vHeight+'px;">';
				h += '<video poster="'+vs[i].videoImg+'" src="'+vs[i].videoLink+'" type="video/mp4" name="media" height="'+vHeight+'" controls="controls" autoplay="autoplay" loop class="app-video-tag"></video>';
				h += '<div class="app-video-title app-shadow">'+vTitle+'</div>';
				h += '<div class="app-video-menu">';
				// 点赞图标和数字
				h += '<span id="zanSpan">';
				if (vs[i].zanUser==0) {
					h += '<span class="mui-icon-extra mui-icon-extra-heart-filled app-video-grey app-shadow" onclick="setZanAdd('+vs[i].videoId+')"></span>';
				} else {
					h += '<span class="mui-icon-extra mui-icon-extra-heart-filled app-heart-light app-shadow" onclick="setZanDel('+vs[i].videoId+')"></span>';
				}
				h += '<input type="hidden" id="zanInputTotal" value="'+vs[i].zanTotal+'"/>';
				h += '</span>';
				h += '<div class="app-video-grey  app-shadow" id="zanDivTotal">'+vs[i].zanTotal+'</div>';
				h += '<div style="height: 10px;"></div>';
				// // 收藏图标和数字
				// h += '<span id="collectSpan">';
				// if (vs[i].collectUser==0) {
				// 	h += '<span class="mui-icon mui-icon-starhalf app-video-grey app-shadow" onclick="setCollectAdd('+vs[i].videoId+')"></span>';
				// } else {
				// 	h += '<span class="mui-icon mui-icon-starhalf app-heart-light app-shadow" onclick="setCollectDel('+vs[i].videoId+')"></span>';
				// }
				// h += '<input type="hidden" id="collectInputTotal" value="'+vs[i].collectTotal+'"/>';
				// h += '</span>';
				// h += '<div class="app-video-grey app-shadow" id="collectDivTotal">'+vs[i].collectTotal+'</div>';
				h += '</div>';
				h += '</div>';
				videoId = vid;
				mui("#vTitle")[0].innerHTML = '点赞<span class="mui-icon mui-icon-download"></span>'+vTitle;
			}
		}
		if (h=='') {
			mui.toast('没有数据',{ 
				duration:'long', type:'div',
			});
			setTimeout(function(){
				mui.back();
			}, 2000);
			return
		}
		mui("#refresh")[0].innerHTML = h;
	}
	//获取ku数据缓存
	function getMarketCache(){
		var resList = cacheGet(marketList);
		if (!resList) {
			var list = new Array(),  //数据数组
				idstring = ''; //ID字符串集合
			return {
				// 数据数组
				list: list,
				// 历史ID集合
				ids: idstring
			};
		}
		return resList;
	}
	// // 点赞增加
	// function setZanAdd(vid){
	// 	// 用户信息
	// 	var userInfo = cacheGet(userInfoKey);
	// 	var uid = userInfo ? userInfo.uid : 0;
	// 	// 系统参数
	// 	var sys = getSys();
	// 	if (sys.day==0 || sys.appAccess=='') {
	// 		mui.toast('参数错误',{ 
	// 			duration:'long', type:'div',
	// 		});
	// 		return
	// 	}
	// 	// 更新显示
	// 	var total = mui("#zanInputTotal")[0].value;
	// 	total = total * 1 + 1;
	// 	mui("#zanSpan")[0].innerHTML = '<span class="mui-icon-extra mui-icon-extra-heart-filled app-heart-light app-shadow" onclick="setZanDel('+vid+')"></span><input type="hidden" id="zanInputTotal" value="'+total+'"/>';
	// 	mui("#zanDivTotal")[0].innerHTML = total;
	// 	mui.toast('你好优秀哦'); 
	// 	// 更新缓存的赞
	// 	var resList = getIndexCache();
	// 	var list = resList.list;
	// 	if (list.length==0) { return }
	// 	for (var i=0;i<list.length;i++) {
	// 		if (list[i].videoId==vid) {
	// 			list[i].zanTotal = total;
	// 			list[i].zanUser = 1;
	// 		}
	// 	}
	// 	resList.list = list;
	// 	cacheSet(indexList, resList);
	// 	// 更新服务器
	// 	mui.ajax(sys.domain+'/app/video/zan/add',{
	// 		data:{
	// 			appAccess: sys.appAccess,
	// 			uid:uid,
	// 			vid: vid
	// 		},
	// 		dataType:'json', //服务器返回json格式数据
	// 		type:'post', //HTTP请求类型
	// 		timeout:10000, //超时时间设置为10秒
	// 		headers:{'Content-Type':'application/x-www-form-urlencoded'}, 
	// 		success:function(res){
	// 			if (res.code!=0) {
	// 				// mui.toast('ERR');
	// 				return
	// 			}
	// 			// mui.toast('OK');
	// 		},
	// 		error:function(xhr,type,errorThrown){
	// 			// console.log('网络错误');
	// 			mui.toast('网络错误！',{ 
	// 				duration:'short', type:'div',
	// 			});
	// 		}
	// 	});
	// }
	// // 点赞减少
	// function setZanDel(vid){
	// 	// 用户信息
	// 	var userInfo = cacheGet(userInfoKey);
	// 	var uid = userInfo ? userInfo.uid : 0;
	// 	// 系统参数
	// 	var sys = getSys();
	// 	if (sys.day==0 || sys.appAccess=='') {
	// 		mui.toast('参数错误',{ 
	// 			duration:'long', type:'div',
	// 		});
	// 		return
	// 	}
	// 	// 更新显示
	// 	var total = mui("#zanInputTotal")[0].value;
	// 	total = total * 1 - 1;
	// 	mui("#zanSpan")[0].innerHTML = '<span class="mui-icon-extra mui-icon-extra-heart-filled app-video-grey app-shadow" onclick="setZanAdd('+vid+')"></span><input type="hidden" id="zanInputTotal" value="'+total+'"/>';
	// 	mui("#zanDivTotal")[0].innerHTML = total;
	// 	mui.toast('宝宝伤心了'); 
	// 	// 更新缓存的赞
	// 	var resList = getIndexCache();
	// 	var list = resList.list;
	// 	for (var i=0;i<list.length;i++) {
	// 		if (list[i].videoId==vid) {
	// 			list[i].zanTotal = total;
	// 			list[i].zanUser = 0;
	// 		}
	// 	}
	// 	resList.list = list;
	// 	cacheSet(indexList, resList);
	// 	// 更新服务器
	// 	mui.ajax(sys.domain+'/app/video/zan/del',{
	// 		data:{
	// 			appAccess: sys.appAccess,
	// 			uid:uid,
	// 			vid: vid
	// 		},
	// 		dataType:'json', //服务器返回json格式数据
	// 		type:'post', //HTTP请求类型
	// 		timeout:10000, //超时时间设置为10秒
	// 		headers:{'Content-Type':'application/x-www-form-urlencoded'}, 
	// 		success:function(res){
	// 			if (res.code!=0) {
	// 				// mui.toast('ERR');
	// 				return
	// 			}
	// 			// mui.toast('OK');
	// 		},
	// 		error:function(xhr,type,errorThrown){
	// 			// console.log('网络错误');
	// 			mui.toast('网络错误！',{ 
	// 				duration:'short', type:'div',
	// 			});
	// 		}
	// 	});
	// }
	// // 收藏增加
	// function setCollectAdd(vid){
	// 	// 用户信息
	// 	var userInfo = cacheGet(userInfoKey);
	// 	var uid = userInfo ? userInfo.uid : 0;
	// 	// 系统参数
	// 	var sys = getSys();
	// 	if (sys.day==0 || sys.appAccess=='') {
	// 		mui.toast('参数错误',{ 
	// 			duration:'long', type:'div',
	// 		});
	// 		return
	// 	}
	// 	// 更新显示
	// 	var total = mui("#collectInputTotal")[0].value;
	// 	total = total * 1 + 1;
	// 	mui("#collectSpan")[0].innerHTML = '<span class="mui-icon mui-icon-starhalf app-heart-light app-shadow" onclick="setCollectDel('+vid+')"></span><input type="hidden" id="collectInputTotal" value="'+total+'"/>';
	// 	mui("#collectDivTotal")[0].innerHTML = total;
	// 	mui.toast('太棒了'); 
	// 	// 更新缓存的收藏
	// 	var resList = getIndexCache();
	// 	var list = resList.list;
	// 	if (list.length==0) { return }
	// 	for (var i=0;i<list.length;i++) {
	// 		if (list[i].videoId==vid) {
	// 			list[i].collectTotal = total;
	// 			list[i].collectUser = 1;
	// 		}
	// 	}
	// 	resList.list = list;
	// 	cacheSet(indexList, resList);
	// 	// 更新服务器
	// 	mui.ajax(sys.domain+'/app/video/collect/add',{
	// 		data:{
	// 			appAccess: sys.appAccess,
	// 			uid:uid,
	// 			vid: vid
	// 		},
	// 		dataType:'json', //服务器返回json格式数据
	// 		type:'post', //HTTP请求类型
	// 		timeout:10000, //超时时间设置为10秒
	// 		headers:{'Content-Type':'application/x-www-form-urlencoded'}, 
	// 		success:function(res){
	// 			if (res.code!=0) {
	// 				// mui.toast('ERR');
	// 				return
	// 			}
	// 			// mui.toast('OK');
	// 		},
	// 		error:function(xhr,type,errorThrown){
	// 			mui.toast('网络错误！',{ 
	// 				duration:'short', type:'div',
	// 			});
	// 		}
	// 	});
	// }
	// // 收藏减少
	// function setCollectDel(vid){
	// 	// 用户信息
	// 	var userInfo = cacheGet(userInfoKey);
	// 	var uid = userInfo ? userInfo.uid : 0;
	// 	// 系统参数
	// 	var sys = getSys();
	// 	if (sys.day==0 || sys.appAccess=='') {
	// 		mui.toast('参数错误',{ 
	// 			duration:'long', type:'div',
	// 		});
	// 		return
	// 	}
	// 	// 更新显示
	// 	var total = mui("#collectInputTotal")[0].value;
	// 	total = total * 1 - 1;
	// 	mui("#collectSpan")[0].innerHTML = '<span class="mui-icon mui-icon-starhalf app-video-grey app-shadow" onclick="setCollectAdd('+vid+')"></span><input type="hidden" id="collectInputTotal" value="'+total+'"/>';
	// 	mui("#collectDivTotal")[0].innerHTML = total;
	// 	mui.toast('宝宝心酸'); 
	// 	// 更新缓存的收藏
	// 	var resList = getIndexCache();
	// 	var list = resList.list;
	// 	for (var i=0;i<list.length;i++) {
	// 		if (list[i].videoId==vid) {
	// 			list[i].collectTotal = total;
	// 			list[i].collectUser = 0;
	// 		}
	// 	}
	// 	resList.list = list;
	// 	cacheSet(indexList, resList);
	// 	// 更新服务器
	// 	mui.ajax(sys.domain+'/app/video/collect/del',{
	// 		data:{
	// 			appAccess: sys.appAccess,
	// 			uid:uid,
	// 			vid: vid
	// 		},
	// 		dataType:'json', //服务器返回json格式数据
	// 		type:'post', //HTTP请求类型
	// 		timeout:10000, //超时时间设置为10秒
	// 		headers:{'Content-Type':'application/x-www-form-urlencoded'}, 
	// 		success:function(res){
	// 			// mui.toast('??'+res.code)
	// 			if (res.code!=0) {
	// 				// mui.toast('ERR');
	// 				return
	// 			}
	// 			// mui.toast('OK');
	// 		},
	// 		error:function(xhr,type,errorThrown){
	// 			mui.toast('网络错误！',{ 
	// 				duration:'short', type:'div',
	// 			});
	// 		}
	// 	});
	// }
</script>